<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>户外运动</title>
    <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
</head>

<body>

    <!-- 内容 -->
    <div class="app-exercising dpflex fdcolumn">

        <!-- 内容1 -->
        <div class="app-exercisingcon dpflex">
            <div class="exercisingtitle">
                <h3>户外跑</h3>
                <p>运动中</p>
            </div>
            <div class="iconset dpflex">
                <span class="iconfont icon-music"></span>
                <span class="iconfont icon-set1"></span>
            </div>
        </div>

        <!-- 内容2 -->
        <div class="app-exercisingcontwo">
            <p>99.99<span>公里</span></p>
        </div>

        <!-- 内容3 -->
        <div class="app-exercisingconthree ">
            <p>GPS信号度低, 数据精准度低 <span class="dashed">-----------------</span> <span class="iconfont icon-position1
                "></span></p>
        </div>

        <!-- 内容4 -->
        <div class="app-exercisingcontfour dpflex">
            <div class="exercisingcontfour">
                <p class="fouricon iconfont icon-shiyongshiduanfenxi
                "></p>
                <p class="speed">配速</p>
                <p class="speedtime">--</p>
            </div>
            <div class="exercisingcontfour ">
                <p class="fouricon iconfont icon-shiyongshiduanfenxi
                "></p>
                <p class="speed">用时</p>
                <p class="speedtime">00:00:20</p>
            </div>
            <div class="exercisingcontfour">
                <p class="fouricon iconfont icon-shiyongshiduanfenxi
                "></p>
                <p class="speed">千卡</p>
                <p class="speedtime">3000</p>
            </div>
        </div>

        <!-- 内容5 -->
        <div class="app-exercisingcontfive">
            <button class="dpflex " id="pauseBtn"> 
                <span class="iconfont icon-stop"></span> 
                <p>暂停</p>
            </button> 
            <span class="iconfont icon-lock"></span>
        </div>

    </div>
</body>

</html>